<template>
  <view class="_data_choose">
    <nut-cell
      :showIcon="true"
      :title="props.title"
      :desc="text ? text : '请选择'"
      @click="openSwitch"
    >
    </nut-cell>
    <nut-calendar
      v-model:visible="state.isVisible"
      :default-value="state.date"
      @close="closeSwitch"
      @choose="setChooseValue"
      :start-date="nowDate"
    >
    </nut-calendar>

    <nut-popup
      :style="{ height: '50%' }"
      position="bottom"
      v-model:visible="show"
    >
      <nut-date-picker
        v-model="currentDate"
        title="时间选择"
        type="time"
        :cancel-text="' '"
        :min-date="minDate"
        @confirm="confirm"
      ></nut-date-picker
    ></nut-popup>
  </view>
</template>
<script lang="ts" setup>
import {computed, nextTick, ref} from "vue";
import useSendGoodsStore from "../../store/sendGoods";
import dayjs from "dayjs";
import Taro from "@tarojs/taro";
const sendGoodsStore = useSendGoodsStore();
const props = defineProps<{
  title: string;
}>();
const show = ref<boolean>(false);
const currentDate = ref(new Date(2022, 0, 1));
const minDate = ref(new Date(2022, 0, 1));
const text = ref<string>("请选择");
const nowDate = computed(()=>{
  dayjs(new Date()).format("YYYY-MM-DD")
})
if (sendGoodsStore.deliveryTime.start && sendGoodsStore.deliveryTime.end) {
  if (props.title === "配送开始时间") {
    text.value = sendGoodsStore.deliveryTime.start;
  } else {
    text.value = sendGoodsStore.deliveryTime.end;
  }
}
function confirm({ selectedValue, selectedOptions }) {
  console.log(selectedValue.join(":"));
  let nowTimestamp = dayjs(new Date()).valueOf()
  if (props.title === "配送开始时间") {
    console.log(sendGoodsStore.deliveryTime.start+'T'+selectedValue.join(":"),777888)
    if(dayjs(new Date(sendGoodsStore.deliveryTime.start+'T'+selectedValue.join(":"))).valueOf() < nowTimestamp){
      Taro.showToast({
        icon: "none",
        title: "开始时间必须超过当前时间",
      });
      return;
    }
    if(sendGoodsStore.deliveryTime.end && (dayjs(new Date(sendGoodsStore.deliveryTime.start+'T'+selectedValue.join(":"))).valueOf() > dayjs(new Date(sendGoodsStore.deliveryTime.end.replace(' ','T')+'Z')).valueOf()-3*60*60*1000)){
      Taro.showToast({
        icon: "none",
        title: "开始时间必须早于结束时间3小时",
      });
      return;
    }
    sendGoodsStore.deliveryTime.start =
      sendGoodsStore.deliveryTime.start + " " + selectedValue.join(":");
    text.value = sendGoodsStore.deliveryTime.start;
  } else {
    if(!sendGoodsStore.deliveryTime.start){
      if(dayjs(new Date(sendGoodsStore.deliveryTime.end+'T'+selectedValue.join(":"))).valueOf()-3*60*60*1000 < nowTimestamp){
        Taro.showToast({
          icon: "none",
          title: "结束时间必须超过当前时间3小时",
        });
        return;
      }
    }
    if(sendGoodsStore.deliveryTime.start){
      if(dayjs(new Date(sendGoodsStore.deliveryTime.end+'T'+selectedValue.join(":"))).valueOf()-3*60*60*1000 < dayjs(new Date(sendGoodsStore.deliveryTime.start.replace(' ','T'))).valueOf()){
        Taro.showToast({
          icon: "none",
          title: "结束时间必须超过开始时间3小时",
        });
        return;
      }
    }
    sendGoodsStore.deliveryTime.end =
      sendGoodsStore.deliveryTime.end + " " + selectedValue.join(":");
    text.value = sendGoodsStore.deliveryTime.end;
  }
  show.value = false;
}
const state = ref({
  isVisible: false,
  date: "",
  dateWeek: "",
});
const openSwitch = () => {
  state.value.isVisible = true;
};
const closeSwitch = () => {
  state.value.isVisible = false;
};
const setChooseValue = (param) => {
  state.value.date = param[3];
  state.value.dateWeek = param[4];

  console.log(param,props.title)
  if (props.title === "配送开始时间") {
    sendGoodsStore.deliveryTime.start = state.value.date;
    text.value = state.value.date;
    //let nowTime = dayjs(new Date()).format("HH:mm:ss")
    //currentDate.value = new Date(state.value.date + 'T' + nowTime)
    currentDate.value = new Date(state.value.date)
    show.value = true;
  } else {
    sendGoodsStore.deliveryTime.end = state.value.date;
    text.value = state.value.date;
    // let minTimestamp
    // if(!sendGoodsStore.deliveryTime.start){
    //   minTimestamp = dayjs(new Date()).valueOf() + 3*60*60*1000
    //   currentDate.value = new Date(minTimestamp)
    // }
    // else{
    //   minTimestamp = dayjs(new Date(sendGoodsStore.deliveryTime.start.replace(' ','T'))).valueOf() + 3*60*60*1000
    //   currentDate.value = new Date(minTimestamp)
    // }
    currentDate.value = new Date(state.value.date)
    show.value = true;
  }
};
</script>
<style lang="scss">
._data_choose {
  --nut-calendar-day67-font-color: #0966ff;
  --nut-calendar-primary-color: #0966ff;
  width: 100%;
  margin-left: 24rpx;
  .nut-cell {
    margin: 0;
    background: #f5f5f5;
  }
  .nut-calendar .nut-calendar__footer .nut-calendar__confirm {
    background: #0966ff;
  }
}
</style>
